<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*
            js虽然是一个面向对象编程语言，但是es6以前是没有传统面向对象的里面的类 class 这个概念
            在js中，1-使用构造函数创建的对象 2-字面量对象

            es6中新增的class 类这样一个概念，
              class（类）是对象的模板，根据es5里面 构造函数一样(为了让js看起来跟传统面向对象一样)


              类--跟构造函数是一样  （人类）
              对象--实例对象--实例---一样  （张三，李四，具体的一个实际存在的）   
        
        */
        // function Dog(name, age) {
        //     this.name = name;
        //     this.age = age;
        //     this.run = function () {
        //         console.log(this.name + '跑');
        //     }
        // }
        // // d1是Dog的实例
        // let d1 = new Dog();
        // let d2 = new Dog();


        /* 
            
            1-类调用的时候 new 类名(参数) ----class 类 必须要加new才能执行\
            2-constructor（构造函数） 方法会在 类被调用的时候自动执行，如果自己没有定义constructor，js会提一个空的constructor函数
                class本质就是一个函数-不是一个新的类型
                es6类可以理解为 把es5换了一种写-包装了---理解为语法糖

                new 类传入的参数 会传递到 constructor方法里面

                constructor（构造函数）内部做了哪些事情--1-创建了一个this对象 2-返回这个this对象
            3-属性-实例属性--对象属性 (必须先使用类创建对象，然在对象上使用的属性)
                    1-写到constructor方法内部
                    2-类内部，不加任何关键字 添加属性
            4-方法--实例方法--对象方法(必须先使用类创建对象，然在对象上使用的方法)    
                类内部    直接写函数，但是不需要添加function 关键字

            5-静态属性和静态方法（类方法--类属性）(很少用)

           实例方法--对象方法(必须先使用类创建对象，然在对象上使用的方法)  arr.push
           实例属性--对象属性 (必须先使用类创建对象，然在对象上使用的属性) arr.length
           
           静态方法（类方法）--直接在类上使用  --Array.isArray()  Array.from()
           静态属性 （类属性）--直接在类上使用

        
        */

        let obj = { test: function () { }, run() { } }
        // 定义类 class 
        class Dog {
            // 静态属性 
            static ppp = 1;
            // 静态方法
            static isDog() {
                console.log('isDog');
                console.log(Dog.ppp);

            }



            // 实例属性
            sex = '公';
            // constructor--方法--类名内部一个方法或者函数--构造函数
            constructor(name, age) {
                // 1- var this = {}
                console.log('constructor');
                console.log(name, age);
                // 2-返回这个this对象

                // 给this添加属性
                this.name = name;
                this.age = age;
            }


            // 实例方法
            // 下面两种定义方法的方式
            test() {
                // this.a = 1;
                console.log(this.name + '：跑');
            }
            // 
            ['aa'] = function (params) {
                console.log(this.name + '：跑');

            }
        }
        let d1 = new Dog('小黑', 2);
        let d2 = new Dog('小白', 1);

        console.log(d1);
        console.log(d2);

        // function
        console.log(typeof Dog);

        // 
        console.log(d1.constructor === Dog);//true


        // let arr =[]//字面量 -语法糖 
        // let arr2 = new Array()

        // 调用 实例方法
        d1.test();
        d2.test();
        d1.aa()

        // 使用实例属性
        console.log(d1.age);
        console.log(d1.name);


        // 调用 静态属性 和静态方法
        Dog.isDog();
        console.log(Dog.ppp);



    </script>

</body>

</html>